﻿<style type="text/css">
    /*法币交易详情*/
    .otcdetails-tit{text-align:center;padding-top: 50px;padding-bottom: 50px;color:#263e56}
    .otcdetails-top{margin-left: 30px;margin-right: 30px;margin-bottom:10px;}
    .otcdetails-top  a{display: block;}
    .otcdetails-top  .de-a{color: #999}
    .otcdetails-top  .de-b{float: right;color:#263e56} 
    .otcdetails-top  .de-b i{font-size: 16px;}
    .otcdetails-mid {background:#f6f7fa;padding-top: 15px;margin:20px 15px 30px 15px;overflow: hidden;}
    .otcdetails-mid p{padding-left:15px;padding-right: 15px;margin-bottom: 15px;}
    .otcdetails-mid p .de-c{color:#999; }
    .otcdetails-mid p .de-d{color:#6c8bd6;float: right;font-weight: 700}
    .otcdetails-mid p .de-d i{color: #ccc;margin-left: 5px;font-size: 14px;font-weight: 100}
    .otcdetails-mid p .de-e{color:#263e56}
    .otcdetails-bot{text-align: center;}
    .otcdetails-bot a{width: 60%;height: 40px;line-height: 40px;background:#6c8bd6;display: inline-block;text-align: center;color: #fff}
</style>
<div class="mv-otcdetails">
    <h2 class="otcdetails-tit" v-text="bag.statename">-</h2>
    <div v-if="bag.activeid == bag.sellerid" v-cloak="">
        <div class="otcdetails-top">
            <span class="de-a">买家(<label v-text="bag.purchaseusername">-</label>)</span>
            <span class="de-b"><label id="purchaseidname" v-text="bag.purchaseidname">-</label><i v-on:click="copy('purchaseidname')" class="iconfont icon-fuzhi"></i></span>
        </div>
        <div class="otcdetails-top" v-if="bag.pay_bank">
            <span class="de-a" v-text="bag.purchasebanktype">-</span>
            <span class="de-b"><label id="purchasebankno" v-text="bag.purchasebankno">-</label><i v-on:click="copy('purchasebankno')" class="iconfont icon-fuzhi"></i></span>
        </div>
        <div class="otcdetails-top" v-if="bag.pay_alipayno">
            <span class="de-a">支付宝</span>
            <span class="de-b"><label id="purchasealipayno" v-text="bag.purchasealipayno">-</label><i v-on:click="copy('purchasealipayno')" class="iconfont icon-fuzhi"></i></span>
        </div>
        <div class="otcdetails-top" v-if="bag.pay_wechat">
            <span class="de-a">微信</span>
            <span class="de-b"><label id="purchasewechat" v-text="bag.purchasewechat">-</label><i v-on:click="copy('purchasewechat')" class="iconfont icon-fuzhi"></i></span>
        </div>
        <div class="otcdetails-top">
            <span class="de-a">手机</span>
            <span class="de-b"><label id="purchasemoblie" v-text="bag.purchasemoblie">-</label><i v-on:click="copy('purchasemoblie')" class="iconfont icon-fuzhi"></i></span>
        </div>
    </div>
    <div v-if="bag.activeid == bag.purchaseid" v-cloak="">
        <div class="otcdetails-top">
            <span class="de-a">卖家(<label v-text="bag.sellerusername">-</label>)</span>
            <span class="de-b"><label id="selleridname" v-text="bag.selleridname">-</label><i v-on:click="copy('selleridname')" class="iconfont icon-fuzhi"></i></span>
        </div>
        <div class="otcdetails-top" v-if="bag.pay_bank">
            <span class="de-a" v-text="bag.sellerbanktype">-</span>
            <span class="de-b"><label id="sellerbankno" v-text="bag.sellerbankno">-</label><i v-on:click="copy('sellerbankno')" class="iconfont icon-fuzhi"></i></span>
        </div>
        <div class="otcdetails-top" v-if="bag.pay_alipayno">
            <span class="de-a">支付宝</span>
            <span class="de-b"><label id="selleralipayno" v-text="bag.selleralipayno">-</label><i v-on:click="copy('selleralipayno')" class="iconfont icon-fuzhi"></i></span>
        </div>
        <div class="otcdetails-top" v-if="bag.pay_wechat">
            <span class="de-a">微信</span>
            <span class="de-b"><label id="sellerwechat" v-text="bag.sellerwechat">-</label><i v-on:click="copy('sellerwechat')" class="iconfont icon-fuzhi"></i></span>
        </div>
        <div class="otcdetails-top">
            <span class="de-a">手机</span>
            <span class="de-b"><label id="sellermoblie" v-text="bag.sellermoblie">-</label><i v-on:click="copy('sellermoblie')" class="iconfont icon-fuzhi"></i></span>
        </div>
    </div>
    <div class="otcdetails-mid">
        <p>
            <span class="de-c">订单金额</span>
            <span class="de-d"><label v-text="bag.total">-</label> CNY</span>
        </p>
        <p>
            <span class="de-c">单价</span>
            <span class="de-d de-e"><label v-text="bag.price">-</label> CNY</span>
        </p>
        <p>
            <span class="de-c">数量</span>
            <span class="de-d de-e" v-text="bag.amount + ' ' + bag.coincode">-</span>
        </p>
        <p>
            <span class="de-c">订单号</span>
            <span class="de-d de-e"><label v-text="bag.id" id="id">-</label><a><i v-on:click="copy('id')" class="iconfont icon-fuzhi"></i></a></span>
        </p>
        <p>
            <span class="de-c">付款参考号</span>
            <span class="de-d de-e"><label v-text="bag.code" id="code">-</label><a><i v-on:click="copy('code')" class="iconfont icon-fuzhi"></i></a></span>
        </p>
        <p>
            <span class="de-c">订单时间</span>
            <span class="de-d de-e" v-text="bag.addtime">-</span>
        </p>
    </div>
    <div class="otcdetails-bot" v-if="bag.activeid == bag.sellerid" v-cloak="">
        <a v-if="bag.state == 1">对方打款中...</a>
        <a v-if="bag.state == 2" v-on:click="release(bag.id)">确认收款</a>
        <a v-if="bag.state >= 3" onclick="mview.view.load('/views/User/asset.html')">查看资产</a>
    </div>
    <div class="otcdetails-bot" v-if="bag.activeid == bag.purchaseid" v-cloak="">
        <a v-if="bag.state == 1" v-on:click="remittance(bag.id)">确定打款</a>
        <a v-if="bag.state == 1" v-on:click="close(bag.id)" style="margin-top:10px;background:#eee;color:#000">取消交易</a>
        <a v-if="bag.state == 2">对方确认中...</a>
        <a v-if="bag.state >= 3" onclick="mview.view.load('/views/User/asset.html')">查看资产</a>
    </div>
</div>
<div style="height:60px;"></div>
<script type="text/javascript">
    var pagedata = {
        request: {
            method: "VIEW_TRANSACTION_CONTRACTDETAIL",
            id: mview.view.chlid.param.id
        },
        screen: {
            header_ok_display: true,
            header_ok_name: '在线沟通',
            header_ok_click: function () {
                var chatid = null;
                if (pagedata.data.bag.activeid != pagedata.data.bag.purchaseid) {
                    chatid = pagedata.data.bag.purchaseid;
                }
                else {
                    chatid = pagedata.data.bag.sellerid;
                }
                mview.view.load('/views/module/friend/message.html', {
                    id: chatid
                });
            },
            footer_display: false,
            header_display: true,
            header_title_name: "交易[" + mview.view.chlid.param.id+"]",
            header_exit_name: "返回",
            header_exit_click: function () {
                mview.view.load('/views/Module/Transaction/contractlists.html')
            },
        },
        onclose: function () {
            window.clearInterval(pagedata.reload_interval);
        },
        oncreate: function () {
            pagedata.reload_interval = setInterval(function () {
                pagedata.reload();
            }, 1500);
        },
        data: {
        },
        methods: {
            remittance: function (id) {
                pagedata.data.editid = id;
                mview.control.confirm("提示", "虚假打款会被封号,是否确认打款?", function () {
                    mview.socket.send({
                        data: {
                            method: "TRANSACTION_REMITTANCE",
                            id: pagedata.data.editid
                        },
                        success: function (data) {
                            if (data.Code == 0) {
                                mview.control.tips("打款成功");
                                pagedata.reload();
                            }
                            else {

                                mview.control.tips(data.Message);
                            }
                        }
                    });
                });
            },
            close: function (id) {
                pagedata.data.editid = id;
                mview.control.confirm("提示", "取消后将无法撤回,是否取消交易?", function () {
                    mview.socket.send({
                        data: {
                            method: "TRANSACTION_CLOSE",
                            id: pagedata.data.editid
                        },
                        success: function (data) {
                            if (data.Code == 0) {
                                mview.control.tips("取消成功");
                                pagedata.reload();
                            }
                            else {

                                mview.control.tips(data.Message);
                            }
                        }
                    });
                });
            },
            release: function (id) {
                pagedata.data.editid = id;
                mview.control.confirm("提示", "一旦确认将无法撤回,是否确认收款?", function () {
                    mview.socket.send({
                        data: {
                            method: "TRANSACTION_RELEASE",
                            id: pagedata.data.editid
                        },
                        success: function (data) {
                            if (data.Code == 0) {
                                mview.control.tips("收款成功");
                                pagedata.reload();
                            }
                            else {

                                mview.control.tips(data.Message);
                            }
                        }
                    });
                });
            },
            copy: function (address) {
                var copyDom = document.querySelector('#' + address)
                var range = document.createRange();
                range.selectNode(copyDom);
                window.getSelection().removeAllRanges();
                window.getSelection().addRange(range);
                var successful = document.execCommand('copy');
                if (successful) {
                    mview.control.tips("已复制到剪切板");
                }
                else {
                    mview.control.tips("复制失败");
                }
            }
        }
    }
    mview.view.chlid.init(pagedata);
</script>